共计 1741 个字符，预计需要花费 5 分钟才能阅读完成。

一言是一个非常有趣的小工具，即随机输出一句话，今天就分享一下 WordPress 网站小工具实用美化之一言的教程，适用于任何主题

首先在 网站后台添加一个自定义 HTML 小工具，名字叫自定义即可。内容粘贴下面的代码，保存即可。

<p id="hitokoto">:D 获取中...</p>
<script src="https://v1.hitokoto.cn/?encode=js&select=%23hitokoto" defer></script>

[title]api 使用示例[/title]

以下的示例包含超链接，您可能需要手动配置样式使其不变色。如果您嫌麻烦，可以移除。<p id="hitokoto"><a href="#" id="hitokoto_text">:D 获取中...</a></p>
<!-- 以下写法，选取一种即可 -->

现代写法，推荐(不支持 IE) 
<script>
  fetch('https://v1.hitokoto.cn')
    .then(response => response.json())
    .then(data => {const hitokoto = document.getElementById('hitokoto_text')
      hitokoto.href = 'https://hitokoto.cn/?uuid=' + data.uuid
      hitokoto.innerText = data.hitokoto
    })
    .catch(console.error)
</script>

如果你配置了 axios 
<script>
  axios.get('https://v1.hitokoto.cn')
    .then(({data}) => {const hitokoto = document.getElementById('hitokoto_text')
      hitokoto.href = 'https://hitokoto.cn/?uuid=' + data.uuid
      hitokoto.innerText = data.hitokoto
    })
    .catch(console.error)
</script>

如果你的站点使用了 jQuery(如果是 JQ 3.x 以及更新的版本，你得使用完整版的 JQ)，那么你可以...
<script>
  $.ajax({
    type: 'GET',
    url: 'https://v1.hitokoto.cn',
    dataType: 'jsonp',
    jsonp: 'callback',
    jsonpCallback: 'hitokoto',
    success (data) {$('#hitokoto_text').attr('href', 'https://hitokoto.cn/?uuid=' + data.uuid)
      $('#hitokoto_text').text(data.hitokoto)
    },
    error (jqXHR, textStatus, errorThrown) {
      // 错误信息处理
      console.error(textStatus, errorThrown)
    }
  })
</script>
<!-- P.S 我们不推荐使用 jQuery Ajax。推荐使用 fetch api 或者 axios.js-->

 老式写法，兼容性最好; 支持 IE 
<script>
  var xhr = new XMLHttpRequest();
  xhr.open('get', 'https://v1.hitokoto.cn');
  xhr.onreadystatechange = function () {if (xhr.readyState === 4) {var data = JSON.parse(xhr.responseText);
      var hitokoto = document.getElementById('hitokoto_text');
      hitokoto.href = 'https://hitokoto.cn/?uuid=' + data.uuid
      hitokoto.innerText = data.hitokoto;
    }
  }
  xhr.send();
</script>

新 API 方法，十分简洁
<script src="https://v1.hitokoto.cn/?encode=js&select=%23hitokoto" defer></script>